<template>
  <q-scroll-area :style="'width: 100%; height: '+scrollHeight+'px;'"
                 :thumb-style="defaultScrollThumbStyle">
    <slot></slot>
  </q-scroll-area>
</template>

<script>
export default {
  name: 'xscrollarea',
  props: {
    scrollHeight: { default: 0 }
  },
  computed: {
    defaultScrollThumbStyle () {
      return {
        right: '4px',
        borderRadius: '5px',
        background: 'red',
        width: '10px',
        opacity: 1
      }
    }
  }
}
</script>

<style scoped>

</style>
